<p>myc01 works!</p>
<!-- 自定义管道 -->
<!-- {{ 5 | sum: 1:2:1 }} -->
<!-- (keyup.enter)="doAdd()" -->
<!-- (keyup)="eventHandler($event)" -->
<div>
  <input
    (keyup)="eventHandler($event)"
    [(ngModel)]="todo"
    type="text"
    placeholder="请输入待办事项"
  />
  <button (click)="doAdd()" [disabled]="todo.length == 0">添加</button>
</div>

<div>
  <ul style="margin: 15px; padding: 4px">
    <!-- ng-for-index -->
    <li style="margin-top: 10px" *ngFor="let item of todoList; let i = index">
      <span [ngClass]="{ danger: i < 3, warn: i > 2 && i < 6, success: i > 5 }">
        {{ item }}
      </span>
      <!-- spice(i,n,c): 从序号i位置删除n个元素,并插入c元素 -->
      <button style="margin-left: 40px" (click)="todoList.splice(i, 1)">
        删除
      </button>
    </li>
  </ul>
</div>

<div [hidden]="todoList.length > 0">
  <b style="font-size: 1.4em">暂无待办事项</b>
</div>
